<template>
  <el-drawer
    :visible.sync="drawerVisible"
    title="分享"
    size="60%"
    direction="rtl"
    :close-on-press-escape="false"
    :wrapperClosable="false"
    :destroy-on-close="true"
    :before-close="beforeClose"
    custom-class="tag-drawer share-album-drawer"
    v-drawerResize
  >
    <div class="drawer-wrap">
      <div class="drawer-content tag-scrollbar">
        <tag-content-header search refresh @toolFun="toolFun" :settingData="columns">
          <template #title>
            <span>用户列表</span>
          </template>
        </tag-content-header>
        <tag-table
          ref="table"
          @refresh="getList"
          :data="dataList"
          :loading="loading"
          :columns="columns"
          :params="params"
          :total="totalSize"
          selection
          rowKey="userId"
        >
        </tag-table>
      </div>
    </div>
    <div class="drawer-btns">
      <el-button @click="beforeClose()">取消</el-button>
      <el-button type="primary" @click="submit">确定</el-button>
    </div>
  </el-drawer>
</template>

<script>
export default {
  props: {
    assetId: {
      type: String,
      required: true,
      default: ''
    }
  },
  data() {
    return {
      drawerVisible: false,
      loading: false,
      dataList: [],
      receiverIds: [],
      columns: [
        {
          show: true,
          label: '登录名',
          prop: 'loginUname',
          search: true,
          searchKey: '',
          sort: true,
          align: 'center'
        },
        {
          show: true,
          label: '昵称',
          prop: 'nname',
          search: true,
          searchKey: '',
          sort: true,
          align: 'center'
        },
        {
          show: true,
          label: '所属公司',
          prop: 'compNm',
          search: true,
          searchKey: '',
          sort: true,
          align: 'center'
        },
        {
          show: true,
          label: '所属部门',
          prop: 'deptNm',
          search: true,
          searchKey: '',
          sort: true,
          align: 'center'
        },
        {
          show: true,
          label: '工号',
          prop: 'empId',
          search: true,
          searchKey: '',
          sort: true,
          align: 'center'
        },
        {
          show: true,
          label: '职位',
          prop: 'userPost',
          search: true,
          searchKey: '',
          sort: true,
          align: 'center'
        }
      ],
      params: {
        ascs: [],
        descs: [],
        currentPageNum: 1,
        pageSize: 10,
        queryParams: {},
        descPriority: false
      },
      totalSize: 0
    }
  },
  methods: {
    showDrawer() {
      this.drawerVisible = true
      this.getShareId()
      this.getList()
    },
    getList() {
      this.loading = true
      this.$ajax({
        url: this.$ajax.setUrl('auth/authUserMgr/pageList'),
        method: 'get',
        params: this.$ajax.setParams(this.params)
      }).then(({ data }) => {
        if (data && data.code === '0') {
          if (data.data.currentPageNum === this.params.currentPageNum) {
            this.dataList = data.data.records
            this.totalSize = data.data.totalSize
            this.receiverIds.forEach(v =>
              this.$nextTick(() => {
                let row = this.dataList.find(user => user.userId === v.toString())
                if (row) {
                  let selectedRow = this.$refs.table.getSelectList()
                  if (!selectedRow.find(item => item.userId === row.userId))
                    this.$refs.table.$refs.tagTable.toggleRowSelection(row)
                }
              })
            )
          }
        } else {
          this.$message.error(data.data || data.msg)
        }
        this.loading = false
      })
    },
    getShareId() {
      this.$ajax({
        url: this.$ajax.setUrl(`cac/cacAstShareLog/haveShared/${this.assetId}`),
        method: 'get',
        params: this.$ajax.setParams()
      }).then(({ data }) => {
        if (data && data.code === '0') {
          this.receiverIds = data.data
        } else {
          // 失败后执行的操作
        }
      })
    },
    toolFun(operation) {
      switch (operation) {
        case 'search':
          // 搜索动作
          this.$refs['table'].searchToggle()
          break
        case 'refresh':
          // 刷新动作
          this.$refs.table.clearSelect()
          this.getList()
          break
      }
    },
    submit() {
      let selectedRow = this.$refs.table.getSelectList()
      if (selectedRow.length) {
        let params = []
        selectedRow.forEach(v => params.push({ receiverId: v.userId, assetId: this.assetId, shareDesc: '' }))
        this.$ajax({
          url: this.$ajax.setUrl('cac/cacAstShareLog/addShare'),
          method: 'post',
          data: this.$ajax.setData(params, false, 'json')
        }).then(({ data }) => {
          if (data && data.code === '0') {
            this.$message.success(data.msg)
            this.beforeClose()
          } else {
            this.$message.error(data.data || data.msg)
          }
        })
      } else {
        this.$message.info('没有选择用户')
      }
    },
    beforeClose() {
      this.receiverIds = []
      this.params = {
        ascs: [],
        descs: [],
        currentPageNum: 1,
        pageSize: 10,
        queryParams: {},
        descPriority: false
      }
      this.columns.forEach(item => {
        if (item.searchKey) item.searchKey = ''
      })
      this.$nextTick(() => {
        this.$refs.table.clearSelect()
        this.drawerVisible = false
      })
    }
  }
}
</script>

<style lang="scss"></style>
